const shoppingApp = new Vue({
    el: "#app",
    data: {
        books: [
            {
                name: '《java从入门到放弃》',
                price: '100',
                sumPrice:100,
                amount: 1
            }, {
                name: '《大头娃娃》',
                price: '200',
                sumPrice:200,
                amount: 1
            }, {
                name: '《小头儿子》',
                price: '500',
                sumPrice:500,
                amount: 1
            }
        ],

    },
    //计算属性
    computed: {
        totalPrice: function () {
           // 方式一
           // let  a= 0;
           //  for (let item of this.books) {
           //      a=a+Number(item.price)*Number(item.amount);
           //  }
           //  return a;
            // 方式二
           //  return this.books.reduce(function (t,book) {
           //      return t + book.price * book.amount;
           //  },0)
           // 方式三
            return this.books.reduce((total,book) => total+book.price*book.amount,0);
        }
    },
    //方法区
    methods: {
        add: function (index) {
            let book=  this.books[index];
            book.amount++;
            book.sumPrice =book.amount*book.price;
        },
        subtract: function (index) {
            let book=  this.books[index];
            book.amount--;
            book.sumPrice =book.amount*book.price;
        },
        remove: function (index) {
            this.books.splice(index, 1);
        }

    },
    //过滤器
    filters: {
        showPrice(price) {
            return '￥' + Number(price).toFixed(2);
        }
    }
})